<template>
  <div class="firstinfoBox">
    <div class="firstinfo">
      <!-- 任务概况页面 -->
      <span class="tit">{{ selectTaskSummaryList.taskName }}</span>
      <span
        class="misLV"
        :class="{
          LvOne: selectTaskSummaryList.priority <= 100,
          LvTwo:
            (selectTaskSummaryList.priority <= 200) &
            (selectTaskSummaryList.priority > 100),
          LvThree: selectTaskSummaryList.priority > 200,
        }"
        >LV {{ selectTaskSummaryList.priority }}</span
      >
      <div class="tags">
        <el-tag
          v-for="(item, index) in selectTaskSummaryList.labelName"
          :key="index"
          size="mini"
          type="info"
          >{{ item.labelName }}</el-tag
        >
      </div>
      <div v-if="taskByProjectType === true">
        <div class="btns" v-if="isCreates === true || isAdmin === true">
          <button
            class="endmis"
            v-preventReClick
            v-if="selectTaskSummaryList.status === 1"
            @click="
              statusBtn({
                taskId: selectTaskSummaryList.taskId,
              })
            "
          >
            开始任务
          </button>
          <button
            class="editmis"
            v-preventReClick
            v-if="selectTaskSummaryList.status !== 1"
            @click="
              restartBtn({
                taskId: selectTaskSummaryList.taskId,
              })
            "
          >
            重启任务
          </button>
          <button
            class="endmis"
            v-if="selectTaskSummaryList.status === 3"
            v-preventReClick
            @click="
              endTaskBtn({
                status: 4,
                taskId: selectTaskSummaryList.taskId,
              })
            "
          >
            结束任务
          </button>
          <button
            class="endmis"
            v-if="isAdmin === true"
            v-preventReClick
            @click="
              delTaskBtn({
                taskId: selectTaskSummaryList.taskId,
              })
            "
          >
            删除任务
          </button>
          <button
            class="editmis"
            v-preventReClick
            v-if="selectTaskSummaryList.status === 1"
            @click="editmisBtn"
          >
            编辑
          </button>
        </div>
      </div>
      <div v-else>
        <div class="btns" v-if="isCreates === true || isAdmin === true">
          <button
            class="endmis"
            v-preventReClick
            v-if="selectTaskSummaryList.status === 1"
            @click="
              statusBtn({
                taskId: selectTaskSummaryList.taskId,
              })
            "
          >
            开始任务
          </button>
          <button
            class="editmis"
            v-preventReClick
            v-if="selectTaskSummaryList.status !== 1"
            @click="
              restartBtn({
                taskId: selectTaskSummaryList.taskId,
              })
            "
          >
            重启任务
          </button>
          <button
            class="endmis"
            v-preventReClick
            v-if="selectTaskSummaryList.status === 3"
            @click="
              endTaskBtn({
                status: 4,
                taskId: selectTaskSummaryList.taskId,
              })
            "
          >
            结束任务
          </button>
          <button
            class="endmis"
            v-preventReClick
            @click="
              delTaskBtn({
                taskId: selectTaskSummaryList.taskId,
              })
            "
          >
            删除任务
          </button>
          <button
            class="editmis"
            v-preventReClick
            v-if="selectTaskSummaryList.status === 1"
            @click="editmisBtn"
          >
            编辑
          </button>
        </div>
      </div>

      <!-- 编辑弹层 -->
      <editDetails
        v-if="selectTaskSummaryList.status === 1"
        :show-dialog.sync="showDialog"
        :selectTaskSummaryList.sync="selectTaskSummaryList"
        :isAdmin.sync="isAdmin"
        :isProjectCreates.sync="isProjectCreates"
        :labelList.sync="labelList"
        :labelNameStr.sync="labelNameStr"
        :arr.sync="arr"
        :taskByProjectType.sync="taskByProjectType"
        :arr1.sync="arr1"
        :arr2.sync="arr2"
      />

      <!-- 任务详情 -->
      <div class="infotable">
        <table cellpadding="0" cellspacing="0">
          <tr height="48">
            <td width="20%">
              <span>所属项目：</span>
              <!-- <span>{{ selectTaskSummaryList.projectName }}</span> -->
              <a
                class="nameConact"
                style="color: #2fc0e0"
                @click="
                  goinProject(
                    selectTaskSummaryList.projectId,
                    selectTaskSummaryList.projectLabel
                  )
                "
                >{{ selectTaskSummaryList.projectName }}</a
              >
            </td>
            <td colspan="2">
              <span>任务名称：</span>
              <span>{{ selectTaskSummaryList.taskName }}</span>
            </td>
            <td width="20%">
              <span>父任务：</span>
              <span>{{ selectTaskSummaryList.parentTaskName }}</span>
            </td>
            <td width="20%">
              <div style="display: flex; align-items: center">
                <span>进度及状态：</span>
                <div class="domany">
                  <div v-if="selectTaskSummaryList.status === 1">
                    <el-progress
                      class="progressBox1"
                      :text-inside="true"
                      :stroke-width="20"
                      :percentage="selectTaskSummaryList.percentage"
                      status="exception"
                    ></el-progress>
                  </div>
                  <div v-else>
                    <el-progress
                      class="progressBox2"
                      :text-inside="true"
                      :stroke-width="20"
                      :percentage="selectTaskSummaryList.percentage"
                      status="exception"
                    ></el-progress>
                  </div>
                </div>
                <span
                  v-if="selectTaskSummaryList.status === 3"
                  class="ingstatus"
                  >进行中</span
                >
                <span
                  v-if="selectTaskSummaryList.status === 1"
                  class="nonestatus"
                  >未开始</span
                >
                <span
                  v-if="selectTaskSummaryList.status === 4"
                  class="completestatus"
                  >已完成</span
                >
                <!-- <span class="manystatus">进行中</span> -->
              </div>
            </td>
          </tr>
          <tr height="120">
            <td>
              <div class="missioner">
                <span>任务负责人：</span>
                <span
                  class="editspan"
                  v-if="
                    Array.isArray(selectTaskSummaryList.chargeRoleList) &&
                    selectTaskSummaryList.chargeRoleList.length > 0
                  "
                  >{{
                    selectTaskSummaryList.chargeRoleList[0].roleId === 0
                      ? "暂无角色"
                      : selectTaskSummaryList.chargeRoleList[0].roleName
                  }}</span
                >
                <span class="editspan" v-else>暂无角色</span>
                <div
                  v-if="
                    Array.isArray(selectTaskSummaryList.chargeList) &&
                    selectTaskSummaryList.chargeList.length > 0
                  "
                >
                  <div
                    class="missionerinfo"
                    v-for="(item, index) in selectTaskSummaryList.chargeList"
                    :key="index"
                  >
                    <p
                      v-if="
                        Array.isArray(item.roleName) &&
                        item.roleName.length === 1
                      "
                    >
                      {{ item.roleName[0].roleName }}
                    </p>
                    <p
                      v-else-if="
                        Array.isArray(item.roleName) && item.roleName.length > 1
                      "
                    >
                      多角色
                    </p>
                    <p v-else style="height: 16px; width: 2px"></p>
                    <img v-if="item.userUrl" :src="item.userUrl" alt="" />
                    <p>{{ item.userName }}</p>
                  </div>
                </div>
              </div>
            </td>

            <td colspan="2">
              <div class="missioner">
                <span>任务成员：</span>
                <div
                  v-if="
                    Array.isArray(selectTaskSummaryList.performidRoleList) &&
                    selectTaskSummaryList.performidRoleList.length > 0
                  "
                >
                  <p
                    class="editspan"
                    v-for="(
                      item, index
                    ) in selectTaskSummaryList.performidRoleList"
                    :key="index"
                  >
                    {{ item.roleName }}
                  </p>
                </div>
                <div class="editBox" v-else>暂无角色</div>
                <div
                  v-if="
                    Array.isArray(selectTaskSummaryList.performidList) &&
                    selectTaskSummaryList.performidList.length > 0
                  "
                >
                  <div
                    class="missionerinfo"
                    v-for="(
                      item, index
                    ) in selectTaskSummaryList.performidList.slice(0, 6)"
                    :key="index"
                  >
                    <p
                      v-if="
                        Array.isArray(item.roleName) &&
                        item.roleName.length === 1
                      "
                    >
                      {{ item.roleName[0].roleName }}
                    </p>
                    <p
                      v-else-if="
                        Array.isArray(item.roleName) && item.roleName.length > 1
                      "
                    >
                      多角色
                    </p>
                    <p v-else style="height: 16px; width: 2px"></p>
                    <img v-if="item.userUrl" :src="item.userUrl" alt="" />
                    <p>{{ item.userName }}</p>
                  </div>
                </div>
                <div
                  v-if="
                    selectTaskSummaryList.performidList &&
                    selectTaskSummaryList.performidList.length > 0
                  "
                >
                  <div
                    v-if="selectTaskSummaryList.performidList.length > 6"
                    class="moremissioner"
                  >
                    <span
                      >等{{
                        selectTaskSummaryList.performidList.length
                      }}人</span
                    >
                  </div>
                </div>
              </div>
            </td>

            <td>
              <div class="missioner">
                <div>审核人：</div>
                <div>
                  <div
                    v-for="(item, index) in selectTaskSummaryList.checkedidList"
                    :key="index"
                  >
                    <p>{{ item.userName }}</p>
                  </div>
                </div>
              </div>
            </td>
            <td>
              <div class="missioner">
                <span>抄送人：</span>
                <span>
                  <span
                    v-for="(item, index) in selectTaskSummaryList.copyidList"
                    :key="index"
                  >
                    <p>{{ item.userName }}</p>
                  </span>
                </span>
              </div>
            </td>
          </tr>

          <tr height="48">
            <td>
              <span>预计工时：</span>
              <span>{{ selectTaskSummaryList.planhours }}</span>
            </td>
            <td colspan="2">
              <span>计划开始时间：</span>
              <span>{{ selectTaskSummaryList.startDate }}</span>
            </td>
            <td>
              <span>计划结束时间：</span>
              <span>{{ selectTaskSummaryList.endDate }}</span>
            </td>
            <td>
              <span>过期：</span>
              <span v-if="selectTaskSummaryList.dateType === false">正常</span>
              <span v-if="selectTaskSummaryList.dateType === true">过期</span>
            </td>
          </tr>
          <tr height="48" v-if="projectType === 2">
            <td>
              <span>类型：</span>
              <span v-if="selectTaskSummaryList.type === 1">任务</span>
              <span v-if="selectTaskSummaryList.type === 2">需求</span>
              <span v-if="selectTaskSummaryList.type === 3">缺陷</span>
              <span v-if="selectTaskSummaryList.type === 4">测试</span>
            </td>
            <td colspan="2">
              <span>功能模块：</span>
              <span>{{ selectTaskSummaryList.projectModuleName }}</span>
            </td>
            <td colspan="2">
              <span>版本迭代：</span>
              <span>{{ selectTaskSummaryList.projectIterationName }}</span>
            </td>
          </tr>
          <tr height="48" v-if="isAdmin">
            <td>
              <span>任务编号：</span>
              <span>{{ selectTaskSummaryList.code }}</span>
            </td>
            <td>
              <span>创建人：</span>
              <span>{{ selectTaskSummaryList.userName }}</span>
            </td>
            <td>
              <span>任务等级：</span>
              <span>{{ selectTaskSummaryList.priority }}</span>
            </td>
            <td>
              <span>任务标签：</span>
              <el-tag
                v-for="(item, index) in selectTaskSummaryList.labelName"
                :key="index"
                size="mini"
                type="info"
                style="margin-right: 8px"
                >{{ item.labelName }}</el-tag
              >
            </td>
            <td>
              <span>评分表：</span>
              <span v-if="selectTaskSummaryList.score">{{
                selectTaskSummaryList.score.name
              }}</span>
            </td>
          </tr>
          <tr height="48" v-if="isAdmin">
            <td colspan="3">
              <span>审核人问卷：</span>
              <el-switch
                style="display: inline-block; height: 45%; margin-left: 10px"
                v-model="selectTaskSummaryList.executor"
                disabled
                active-text="是"
                inactive-text="否"
              >
              </el-switch>
            </td>
            <td colspan="2">
              <span>执行人问卷：</span>
              <el-switch
                style="display: inline-block; height: 45%; margin-left: 10px"
                v-model="selectTaskSummaryList.reviewer"
                disabled
                active-text="是"
                inactive-text="否"
              >
              </el-switch>
            </td>
          </tr>
        </table>
      </div>

      <!-- 交互成果 -->
      <div class="giventable">
        <p class="distit">交付成果</p>
        <el-table
          :data="selectResultList"
          style="width: 100%"
          border
          :header-cell-style="{
            textAlign: 'center',
            background: '#fff',
            color: '#333',
            height: '55px',
            fontSize: '14px',
          }"
          :cell-style="{ textAlign: 'center', height: '160px', padding: '0' }"
        >
          <el-table-column label="交付人">
            <template slot-scope="scope">
              <p>{{ scope.row.userRoleName }}</p>
              <img
                class="uperinfo"
                v-if="scope.row.userUrl"
                :src="scope.row.userUrl"
                alt=""
              />
              <p>{{ scope.row.userName }}</p>
            </template>
          </el-table-column>
          <el-table-column label="交付说明" width="280">
            <template slot-scope="scope">
              <div
                v-if="
                  scope.row.userId === userId &&
                  (scope.row.status === 2 || scope.row.status === 7)
                "
                class="upercontent"
              >
                <input
                  id="nameInput"
                  type="text"
                  v-model="inputContent"
                  placeholder="请输入交付内容"
                />
              </div>
              <div v-else class="upercontent">
                <p class="empty" v-if="scope.row.content === ''">无交付内容</p>
                <p v-else>{{ scope.row.content }}</p>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="交付附件" min-width="320">
            <template slot-scope="scope">
              <div class="nofile">
                <div class="upfiles">
                  <div>
                    <div
                      class="upfile"
                      v-for="(item, index) in scope.row.fileVoList"
                      :key="index"
                    >
                      <div class="upfileinfo">
                        <img
                          src="@/assets/wenjianleixing-fujian-2.png"
                          alt=""
                        />
                        <a>{{ item.fileName }}</a>
                        <div class="filedo">
                          <a
                            v-if="
                              scope.row.userId === userId &&
                              (scope.row.status === 2 || scope.row.status === 7)
                            "
                            @click="removeFile(item)"
                            >删除</a
                          >
                          <a
                            v-if="
                              selectType.indexOf(2) !== -1 || usertype !== 4
                            "
                            :href="item.fileUrl"
                            >下载</a
                          >
                        </div>
                      </div>
                    </div>
                    <div
                      v-if="
                        scope.row.userId === userId &&
                        (scope.row.status === 2 || scope.row.status === 7)
                      "
                    >
                      <el-progress
                        v-if="showPercent"
                        style="width: 180px; margin-left: 10px"
                        :percentage="progressPercent"
                      />
                    </div>
                  </div>
                  <div
                    v-if="
                      scope.row.userId === userId &&
                      (scope.row.status === 2 || scope.row.status === 7)
                    "
                  >
                    <div
                      v-if="
                        Array.isArray(scope.row.fileVoList) &&
                        scope.row.fileVoList.length < 10 &&
                        Array.isArray(fileList) &&
                        fileList.length < 10
                      "
                      class="lessfile"
                    >
                      <el-upload
                        style="display: inline-block"
                        :headers="{ token: token }"
                        action="http://test.zhihanyixing.com:8084/file/upload"
                        :on-success="handleSuccess"
                        :before-upload="handleChange"
                        :on-progress="onUpload"
                        :multiple="true"
                        :data="{
                          userId: userId,
                          type: 4,
                          businessId: businessId,
                        }"
                        :show-file-list="false"
                        :limit="11"
                        :on-exceed="handleExceed"
                        :file-list="fileList"
                      >
                        <button
                          class="plus"
                          slot="trigger"
                          @click="uploadBtn(scope.row)"
                        >
                          +
                        </button>
                      </el-upload>
                    </div>
                  </div>
                </div>
              </div>
            </template>
          </el-table-column>
          <el-table-column label="交付状态">
            <template slot-scope="scope">
              <p v-if="scope.row.status === 1">待开始</p>
              <p v-if="scope.row.status === 2">待完成</p>
              <p v-if="scope.row.status === 3">待填写</p>
              <p v-if="scope.row.status === 4">待审核</p>
              <p v-if="scope.row.status === 5">审核中</p>
              <p v-if="scope.row.status === 8">审核中</p>
              <p v-if="scope.row.status === 6">已审核</p>
              <p v-if="scope.row.status === 7">审核未通过</p>
            </template>
          </el-table-column>
          <el-table-column label="审核人" min-width="120">
            <template slot-scope="scope">
              <p
                class="shrBox"
                v-for="(item, index) in scope.row.taskVoList"
                :key="index"
              >
                {{ index + 1 }}. {{ item.userName }} &nbsp;
                <span v-if="item.status === 1">
                  <img
                    src="@/assets/daishenhe.png"
                    alt=""
                    style="width: 12px; height: 12px; margin-top: 2px"
                  />
                </span>
                <span v-else-if="item.status === 2">
                  <i
                    class="el-icon-circle-check"
                    style="color: #67c23a; font-size: 12px"
                  ></i>
                </span>
                <span v-else>
                  <i
                    class="el-icon-circle-close"
                    style="color: red; font-size: 12px"
                  ></i>
                </span>
              </p>
            </template>
          </el-table-column>
          <el-table-column label="实际工时">
            <template slot-scope="scope">
              <div v-if="scope.row.endTime !== null">
                {{ scope.row.actualhours }}
              </div>
              <div v-else-if="scope.row.startTime !== null">
                {{ scope.row.actualhours }}
              </div>
            </template>
          </el-table-column>
          <el-table-column label="操作">
            <template slot-scope="scope">
              <div v-if="selectTaskSummaryList.status === 3">
                <!-- 执行人按钮 -->
                <div
                  v-if="
                    selectType.indexOf(1) !== -1 && scope.row.userId === userId
                  "
                >
                  <img
                    v-if="scope.row.status === 1"
                    title="开始任务"
                    style="
                      width: 41px;
                      height: 41px;
                      border-radius: 50%;
                      cursor: pointer;
                    "
                    v-preventReClick
                    @click="startTaskBtn(scope.row)"
                    src="@/assets/kaishi2x.png"
                    alt=""
                  />
                  <img
                    v-if="scope.row.status === 2 || scope.row.status === 7"
                    title="提交结果"
                    style="
                      width: 41px;
                      height: 41px;
                      border-radius: 50%;
                      cursor: pointer;
                    "
                    v-preventReClick
                    @click="submitResultsBtn(scope.row)"
                    src="@/assets/tijiaojieguo.png"
                    alt=""
                  />
                  <img
                    v-if="scope.row.status === 3"
                    title="填写问卷"
                    style="
                      width: 41px;
                      height: 41px;
                      border-radius: 50%;
                      cursor: pointer;
                    "
                    v-preventReClick
                    @click="questionnaireDiaBtn(scope.row)"
                    src="@/assets/tianxiewenjuan2x.png"
                    alt=""
                  />
                  <img
                    v-if="scope.row.status === 4"
                    title="提交审核"
                    style="
                      width: 41px;
                      height: 41px;
                      border-radius: 50%;
                      cursor: pointer;
                    "
                    v-preventReClick
                    @click="submitReviewBtn(scope.row)"
                    src="@/assets/tijiaoshenhe2x.png"
                    alt=""
                  />
                </div>
                <!-- 审核人按钮 -->
                <div v-if="selectType.indexOf(2) !== -1">
                  <img
                    v-if="
                      scope.row.status === 5 &&
                      scope.row.userIdList.indexOf(userId) === -1
                    "
                    title="审核"
                    style="
                      width: 41px;
                      height: 41px;
                      border-radius: 50%;
                      cursor: pointer;
                    "
                    v-preventReClick
                    @click="shenHeShowBtn(scope.row)"
                    src="@/assets/shenhe2x.png"
                    alt=""
                  />
                  <img
                    v-if="
                      scope.row.status === 8 &&
                      scope.row.userIdList.indexOf(userId) === -1
                    "
                    title="填写问卷"
                    style="
                      width: 41px;
                      height: 41px;
                      border-radius: 50%;
                      cursor: pointer;
                    "
                    v-preventReClick
                    @click="questionnaireDiaBtn1(scope.row)"
                    src="@/assets/shenhe2x.png"
                    alt=""
                  />
                </div>
              </div>
              <img
                v-if="scope.row.status === 6"
                title="已完成"
                style="width: 45px; height: 41px; border-radius: 50%"
                src="@/assets/yiwancheng.png"
                alt=""
              />
            </template>
          </el-table-column>
        </el-table>
      </div>

      <!-- 执行人填写问卷页面 -->
      <el-dialog
        width="70%"
        :show-close="false"
        :close-on-click-modal="false"
        :visible.sync="questionnaireDia"
        :close-on-press-escape="false"
        top="5vh"
        style="padding: 0"
        v-if="editList !== null"
      >
        <div class="DiaTable">
          <div class="DiaTopBox DiaTopBox1">人员列表</div>
          <div class="missionerinfoBox">
            <div class="missBox">任务负责人：</div>
            <div
              v-if="
                Array.isArray(selectTaskSummaryList.chargeList) &&
                selectTaskSummaryList.chargeList.length > 0
              "
            >
              <div
                class="missionerinfo"
                v-for="(item, index) in selectTaskSummaryList.chargeList"
                :key="index"
              >
                <p
                  v-if="
                    Array.isArray(item.roleName) && item.roleName.length === 1
                  "
                >
                  {{ item.roleName[0].roleName }}
                </p>
                <p
                  v-else-if="
                    Array.isArray(item.roleName) && item.roleName.length > 1
                  "
                >
                  多角色
                </p>
                <p v-else style="height: 16px; width: 2px"></p>
                <img v-if="item.userUrl" :src="item.userUrl" alt="" />
                <p>{{ item.userName }}</p>
              </div>
            </div>
            <div class="missBox">任务成员：</div>
            <div
              v-if="
                Array.isArray(selectTaskSummaryList.performidList) &&
                selectTaskSummaryList.performidList.length > 0
              "
            >
              <div
                class="missionerinfo"
                v-for="(
                  item, index
                ) in selectTaskSummaryList.performidList.slice(0, 6)"
                :key="index"
              >
                <p
                  v-if="
                    Array.isArray(item.roleName) && item.roleName.length === 1
                  "
                >
                  {{ item.roleName[0].roleName }}
                </p>
                <p
                  v-else-if="
                    Array.isArray(item.roleName) && item.roleName.length > 1
                  "
                >
                  多角色
                </p>
                <p v-else style="height: 16px; width: 2px"></p>
                <img v-if="item.userUrl" :src="item.userUrl" alt="" />
                <p>{{ item.userName }}</p>
              </div>
            </div>
          </div>
          <el-table
            :data="editList.questionList"
            height="60vh"
            style="width: 100%; margin: 0"
            :header-cell-style="{
              textAlign: 'center',
              color: '#333',
              fontWeight: '400',
              height: '55px',
              fontSize: '14px',
            }"
            :cell-style="{ textAlign: 'center' }"
          >
            <el-table-column
              type="index"
              label="编号"
              width="97"
            ></el-table-column>
            <el-table-column label="问题">
              <template slot-scope="scope">
                <div>
                  <span v-if="scope.row.questionType === 1">( 单选 )</span>
                  <span v-else
                    >( 多选：{{ scope.row.mincount }}-{{ scope.row.maxcount }}个
                    )</span
                  >
                  <span>{{ scope.row.title }}</span>
                </div>
              </template>
            </el-table-column>
            <el-table-column label="选项" width="370">
              <template slot-scope="scope">
                <div>
                  <div
                    class="optionBox"
                    style="margin: 5px 0"
                    v-for="(item, index) in scope.row.answervolist"
                    :key="index"
                    @click="clickInput"
                  >
                    {{ item.itemName }}
                    <input
                      v-if="scope.row.questionType === 1"
                      :name="scope.row.questionId"
                      type="radio"
                      class="checkBox"
                      v-model="item.checked"
                      @click="inputClickEvent($event)"
                      @change="getboxValue1($event, item, scope.row)"
                    />
                    <input
                      v-else
                      :name="scope.row.questionId"
                      type="checkbox"
                      class="checkBox checkBox1"
                      v-model="item.checked"
                      @click="inputClickEvent($event)"
                      @change="getboxValue2($event, item, scope.row)"
                    />
                  </div>
                </div>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <div class="btnbox">
          <button class="cancle" @click="questionnaireDia = false">取消</button>
          <button class="edit" @click="reviewOk()" v-preventReClick>
            提交
          </button>
        </div>
      </el-dialog>

      <!-- 审核人填写问卷页面 -->
      <el-dialog
        width="70%"
        :show-close="false"
        :close-on-click-modal="false"
        :visible.sync="questionnaireDia1"
        :close-on-press-escape="false"
        top="30px"
        style="padding: 0"
        v-if="editList1 !== null"
      >
        <div class="DioBox">
          <div class="DiaTopBox">
            审核
            <i
              class="el-icon-close closeBtn"
              @click="questionnaireDia1 = false"
            ></i>
          </div>
          <div class="DiaBodyBox DiaBodyBox1">
            <p>原因说明</p>
            <textarea
              type="textarea"
              v-model="addtrcData.reason"
              class="disbox"
              placeholder="请输入审核原因"
            />
          </div>
          <div class="DiaTopBox DiaTopBox1">人员列表</div>
          <div class="missionerinfoBox">
            <div class="missBox">任务负责人：</div>
            <div
              v-if="
                Array.isArray(selectTaskSummaryList.chargeList) &&
                selectTaskSummaryList.chargeList.length > 0
              "
            >
              <div
                class="missionerinfo"
                v-for="(item, index) in selectTaskSummaryList.chargeList"
                :key="index"
              >
                <p
                  v-if="
                    Array.isArray(item.roleName) && item.roleName.length === 1
                  "
                >
                  {{ item.roleName[0].roleName }}
                </p>
                <p
                  v-else-if="
                    Array.isArray(item.roleName) && item.roleName.length > 1
                  "
                >
                  多角色
                </p>
                <p v-else style="height: 16px; width: 2px"></p>
                <img v-if="item.userUrl" :src="item.userUrl" alt="" />
                <p>{{ item.userName }}</p>
              </div>
            </div>
            <div class="missBox">任务成员：</div>
            <div
              v-if="
                Array.isArray(selectTaskSummaryList.performidList) &&
                selectTaskSummaryList.performidList.length > 0
              "
            >
              <div
                class="missionerinfo"
                v-for="(
                  item, index
                ) in selectTaskSummaryList.performidList.slice(0, 6)"
                :key="index"
              >
                <p
                  v-if="
                    Array.isArray(item.roleName) && item.roleName.length === 1
                  "
                >
                  {{ item.roleName[0].roleName }}
                </p>
                <p
                  v-else-if="
                    Array.isArray(item.roleName) && item.roleName.length > 1
                  "
                >
                  多角色
                </p>
                <p v-else style="height: 16px; width: 2px"></p>
                <img v-if="item.userUrl" :src="item.userUrl" alt="" />
                <p>{{ item.userName }}</p>
              </div>
            </div>
          </div>
          <div class="DiaTopBox DiaTopBox1">填写问卷</div>
        </div>
        <div class="DiaTable">
          <el-table
            :data="editList1.questionList"
            height="55vh"
            style="width: 100%; margin: 0"
            :header-cell-style="{
              textAlign: 'center',
              color: '#333',
              background: '#fff',
              fontWeight: '400',
              height: '55px',
              fontSize: '14px',
            }"
            :cell-style="{ textAlign: 'center' }"
          >
            <el-table-column
              type="index"
              label="编号"
              width="97"
            ></el-table-column>
            <el-table-column label="问题">
              <template slot-scope="scope">
                <div>
                  <span v-if="scope.row.questionType === 1">( 单选 )</span>
                  <span v-else
                    >( 多选：{{ scope.row.mincount }}-{{ scope.row.maxcount }}个
                    )</span
                  >
                  <span>{{ scope.row.title }}</span>
                </div>
              </template>
            </el-table-column>
            <el-table-column label="选项" width="370">
              <template slot-scope="scope">
                <div
                  class="optionBox"
                  style="margin: 5px 0"
                  v-for="(item, index) in scope.row.answervolist"
                  :key="index"
                  @click="clickInput"
                >
                  {{ item.itemName }}
                  <input
                    v-if="scope.row.questionType === 1"
                    :name="scope.row.questionId"
                    type="radio"
                    class="checkBox"
                    v-model="item.checked"
                    :checked="item.checked"
                    value="true"
                    @click="inputClickEvent($event)"
                    @change="getboxValue3($event, item, scope.row)"
                  />
                  <input
                    v-else
                    :name="scope.row.questionId"
                    type="checkbox"
                    class="checkBox checkBox1"
                    v-model="item.checked"
                    :checked="item.checked"
                    @click="inputClickEvent($event)"
                    @change="getboxValue4($event, item, scope.row)"
                  />
                </div>
              </template>
            </el-table-column>
          </el-table>
        </div>
        <div class="btnbox">
          <button class="cancle" @click="reviewDel()" v-preventReClick>
            退回
          </button>
          <button class="edit" @click="reviewOk1()" v-preventReClick>
            通过
          </button>
        </div>
      </el-dialog>

      <!-- 审核弹层 -->
      <el-dialog
        width="450px"
        :visible.sync="shenHeShow"
        :close-on-press-escape="false"
        top="25vh"
        style="padding: 0"
      >
        <div class="DioBox">
          <div class="DiaTopBox">
            审核
            <i class="el-icon-close closeBtn" @click="shenHeShow = false"></i>
          </div>
          <div class="DiaBodyBox">
            <p>原因说明</p>
            <textarea
              type="textarea"
              v-model="addtrcData.reason"
              class="disbox disbox1"
              placeholder="请输入审核原因"
            />
          </div>
          <div class="btnbox">
            <button class="cancle" @click="reviewReturn()" v-preventReClick>
              退回
            </button>
            <button class="edit" @click="confirmup()" v-preventReClick>
              通过
            </button>
          </div>
        </div>
      </el-dialog>

      <div class="footertab">
        <a
          href="javasript:void(0);"
          :class="index == isactive ? 'active' : ''"
          @click="handelchange(index)"
          v-for="(item, index) in footertablist"
          :key="index"
        >
          {{ item.name }}
          <!-- <span class="litline"></span> -->
        </a>
      </div>

      <!-- 操作日志 -->
      <dosth
        :is="footerview"
        :logVoList.sync="logVoList"
        :commentList.sync="commentList"
        :commentUserId.sync="commentUserId"
        keep-alive
      ></dosth>
    </div>
  </div>
</template>

<script>
import { getSelectTaskSummary, taskStart, restartTask, deleteFile, getSelectTaskByProject, updateTaskStatus, resultTesting, resultBigTesting, deleteTask, getSelectProjectType, getSelectTesting, getSelectResult, getSelectType, updateStauts, updateResult, submitTesting, submitReviewersTesting, getSelectNowAnswerByTaskId, getSelectLastExamine, getSelectTypeByUserId, getSelectLastApproveIs, addtrc, getSelectReviewerStatus } from '@/api/task/task.js';
import dosth from './footertab/dosth.vue';
import projectinfo from './footertab/projectinfo.vue';
import editDetails from './footertab/editDetails.vue';
export default {
  name: 'first-info',
  inject: ['reload'],
  props: {},
  data() {
    return {
      showPercent: false, // 进度条显示
      progressPercent: 0,
      uploading: false, // 是否上传中
      timer2: null,
      finishtimer: null,

      // ----------------------------------------
      selectTaskSummaryList: {}, // 任务概况数据
      footerview: 'projectinfo', // 评论和日志转换器
      logVoList: [], // 日志列表
      commentList: [], // 评论列表
      commentUserId: null, // 评论列表
      showDialog: false, // 编辑弹层控制
      selectType: [], // 登录人属性--1执行人员2审核人员3抄送人员4负责人
      usertype: parseInt(sessionStorage.getItem('usertype')), // 当前用户属性
      businessId: null, // 附件上传业务id
      inputContent: '', // 交互结果提交内容

      labelList: [], // 标签列表
      labelNameStr: [],
      arr: [],
      arr1: [],
      arr2: [],
      projectType: null, // 项目类型
      token: sessionStorage.getItem('usertoken'),
      userId: parseInt(sessionStorage.getItem('userid')), // 用户ID
      fileList: [], // 任务附件列表,
      questionnaireDia: false, // 执行人问卷弹层控制
      questionnaireDia1: false, // 审核人问卷弹层控制
      shenHeShow: false, // 审核弹层控制
      // editList: {
      //   testId: 8, // 问卷id
      //   testType: 1, // 问卷属性1执行人2审核人
      //   questionList: [ // 问题列表
      //     {
      //       questionId: 13, // 问题id
      //       title: '在这个任务中谁是给了你最多的帮助？', // 问题
      //       questionType: 1, // 问题属性1单选2多选
      //       mincount: 1, // 问题最小值
      //       maxcount: 3, // 问题最大值
      //       answervolist: [ // 每个问题的选项列表
      //         {
      //           itemId: 12, // 选项id
      //           itemName: '选项3', // 选项名称
      //           evalList: {
      //             evaluationdetailitemId: 2199, // 能力id
      //             evalItemName: '数据库熟练' // 能力名字
      //           },
      //           roleVoList: {
      //             evaluationRoleId: 381, // 角色id
      //             evalroleName: '4444' // 角色名字
      //           },
      //           points: 77, // 分值
      //           pointsType: 1// 分值类型1过程2阶段
      //         },
      //         {
      //           itemId: 11,
      //           itemName: '选项2',
      //           evaluationdetailitemId: 1,
      //           evalItemName: '能力2',
      //           evaluationRoleId: 1,
      //           evalroleName: '李四',
      //           points: 99,
      //           pointsType: 1
      //         },
      //         {
      //           itemId: 10,
      //           itemName: '选项1',
      //           evaluationdetailitemId: 2,
      //           evalItemName: '能力3',
      //           evaluationRoleId: 3,
      //           evalroleName: '王二',
      //           points: 88,
      //           pointsType: 1
      //         }
      //       ]
      //     },
      //     {
      //       questionId: 12,
      //       title: '问题名称2',
      //       questionType: 2,
      //       mincount: 2,
      //       maxcount: 4,
      //       answervolist: [
      //         {
      //           itemId: 12, // 选项id
      //           itemName: '选项111', // 选项名称
      //           evalList: {
      //             evaluationdetailitemId: 2199, // 能力id
      //             evalItemName: '数据库熟练' // 能力名字
      //           },
      //           roleVoList: {
      //             evaluationRoleId: 381, // 角色id
      //             evalroleName: '4444' // 角色名字
      //           },
      //           points: 77, // 分值
      //           pointsType: 1// 分值类型1过程2阶段
      //         },
      //         {
      //           itemId: 11,
      //           itemName: '选项222',
      //           evaluationdetailitemId: 1,
      //           evalItemName: '能力2',
      //           evaluationRoleId: 1,
      //           evalroleName: '李四',
      //           points: 99,
      //           pointsType: 1
      //         },
      //         {
      //           itemId: 10,
      //           itemName: '选项333',
      //           evaluationdetailitemId: 2,
      //           evalItemName: '能力3',
      //           evaluationRoleId: 3,
      //           evalroleName: '王二',
      //           points: 88,
      //           pointsType: 1
      //         }]
      //     },
      //     {
      //       questionId: 11,
      //       title: '问题名称3',
      //       questionType: 1,
      //       mincount: 3,
      //       maxcount: 4,
      //       answervolist: [
      //         {
      //           itemId: 12, // 选项id
      //           itemName: '选项3321', // 选项名称
      //           evalList: {
      //             evaluationdetailitemId: 2199, // 能力id
      //             evalItemName: '数据库熟练' // 能力名字
      //           },
      //           roleVoList: {
      //             evaluationRoleId: 381, // 角色id
      //             evalroleName: '4444' // 角色名字
      //           },
      //           points: 77, // 分值
      //           pointsType: 1// 分值类型1过程2阶段
      //         },
      //         {
      //           itemId: 11,
      //           itemName: '选项3322',
      //           evaluationdetailitemId: 1,
      //           evalItemName: '能力2',
      //           evaluationRoleId: 1,
      //           evalroleName: '李四',
      //           points: 99,
      //           pointsType: 1
      //         },
      //         {
      //           itemId: 10,
      //           itemName: '选项3323',
      //           evaluationdetailitemId: 2,
      //           evalItemName: '能力3',
      //           evaluationRoleId: 3,
      //           evalroleName: '王二',
      //           points: 88,
      //           pointsType: 1
      //         }]
      //     }
      //   ]
      // }, // 执行人问卷数据

      editList: {}, // 执行人问卷数据
      editList1: {}, // 审核人问卷数据

      selectResultList: [], // 交互成果数据
      // 交互状态数据
      stautsData: {
        status: null, // 交互结果状态
        taskresultId: null, // 交互结果id
        type: null // 登录人类型
      },
      // 提交结果数据
      resultData: {
        content: '',
        id: 0,
        type: 0
      },
      // 提交问卷数据
      submitTestingData: {
        taskId: null, // 任务id
        taskResultId: null, // 任务结果id
        testingQuestionItemId: [], // 问卷选项id
        userId: parseInt(sessionStorage.getItem('userid')) // 评分人id
      },
      // 审核提交数据
      addtrcData: {
        reason: '', // 审核原因
        status: 0, // 状态
        taskresultid: 0, // 任务结果id
        userid: parseInt(sessionStorage.getItem('userid')) // 用户id
      },
      // 查询审核人是否全部审核完，并修改状态
      reviewerStatusData: {
        taskId: null, // 任务id
        taskResultId: null // 任务结果id
      },
      isAdmin: false, // 是否是管理员
      isCreates: null, // 判断当前登录人是否是任务或项目的创建人或负责人
      isProjectCreates: false, // 判断当前登录人是否是项目的创建人或负责人
      resuleStatusList: [], // 交互结果状态列表
      approveIsData: {
        taskId: null, // 任务id
        taskResultId: null // 任务结果审核id
      }, // 判断当前登录人的上一个审核人是否审核数据
      // 计时器数据---------------------
      flag: null,
      one: '00', // 时
      two: '00', // 分
      three: '00', // 秒
      abc: 0, // 秒的计数
      cde: 0, // 分的计数
      efg: 0, // 时的计数
      nowTime: '',
      timer: null,
      taskByProjectType: null, // 判断该任务所属的项目是否复制项目
      nowAnswer: [], // 审核人问卷答案

      // -------------------
      isactive: 0,
      footertablist: [
        { name: '任务评论' },
        { name: '操作日志' }
      ]
    };
  },
  created() {
    this.getIsStatus();
    this.getSelectTypeByUserId();
    this.getSelectTaskSummary();
    // this.startHandler();
    setTimeout(() => {
      // console.log(this.resuleStatusList);
      if (this.resuleStatusList.length !== 0) {
        if (this.resuleStatusList.indexOf(2) !== -1) {
          this.timer = setInterval(() => {
            // console.log(this.selectResultList);
            // console.log('111');
            this.getSelectResultList();
            // console.log('1');
          }, 1000);
        }
      } else {
        clearInterval(this.timer);
      }
    }, 1000);
  },
  beforeDestroy() {
    if (this.timer) {
      clearInterval(this.timer); // 在Vue实例销毁前，清除定时器
    }
  },
  components: {
    dosth,
    projectinfo,
    editDetails
  },
  methods: {
    // 项目跳转
    goinProject(id, label) {
      // console.log(id);
      if (this.projectType === 1) {
        this.$router.push({
          name: 'Prodetail',
          params: {
            projectId: id,
            projectLabel: label,
            index: 0,
            currentView: 'survey'
          }
        });
        localStorage.setItem('projectId', id);
      } else {
        this.$router.push({
          name: 'Agileproject',
          params: {
            projectId: id,
            projectLabel: label,
            index: 0,
            currentView: 'survey'
          }
        });
        localStorage.setItem('projectId', id);
      }
    },
    // 获取任务概况
    async getSelectTaskSummary() {
      // 获取任务概况
      const { data } = await getSelectTaskSummary({ taskId: parseInt(localStorage.getItem('taskId')) });
      // console.log(data);
      if (data.executor === 1) {
        data.executor = true;
      } else {
        data.executor = false;
      }
      if (data.reviewer === 1) {
        data.reviewer = true;
      } else {
        data.reviewer = false;
      }
      if (data.percentage > 100) {
        data.percentage = 100;
      }
      this.selectTaskSummaryList = data;
      this.logVoList = data.logVoList;
      this.commentList = data.commentList;
      this.commentUserId = data.userId;
      // console.log(this.commentUserId);
      // 获取项目属性
      const { data: data1 } = await getSelectProjectType({ projectId: parseInt(data.projectId) });
      this.projectType = data1;
      // console.log(this.projectType);
      // 获取执行人问卷
      const { data: data2 } = await getSelectTesting({ taskId: parseInt(localStorage.getItem('taskId')), testType: 1 });
      // const {data: data2} = await getSelectTesting({taskId: 22, testType: 1}); // 测试
      this.editList = data2;
      // console.log(this.editList);
      // 获取交互结果
      const { data: data3 } = await getSelectResult({ taskId: parseInt(localStorage.getItem('taskId')) });
      // const {data: data3} = await getSelectResult({taskId: 1}); // 测试
      this.selectResultList = data3;
      // console.log(this.selectResultList);
      if (this.selectResultList !== null && this.selectResultList.length !== 0) {
        this.selectResultList.forEach(item => {
          if (item.startTime !== null) {
            item.actualhours = this.timeInit(item.startTime, item.endTime);
          }
          this.resuleStatusList.push(item.status);
        });
      }
      // console.log(this.resuleStatusList);
      // 获取当前登录人属性
      const res = await getSelectType({ taskId: parseInt(localStorage.getItem('taskId')), userId: parseInt(sessionStorage.getItem('userid')) });
      // const {data: data4} = await getSelectType({taskId: 1, userId: 1}); // 测试
      this.selectType = res.data;
      setTimeout(() => {
        this.getlabel();
        this.getCheckedId();
        this.getCopyId();
        this.getPerformId();
      }, 100);
      // 获取当前项目属性
      const res1 = await getSelectTaskByProject({ taskId: parseInt(localStorage.getItem('taskId')) });
      this.taskByProjectType = res1.data;
      // console.log(this.taskByProjectType);
      // console.log(res1);
      // console.log(this.selectType);
      console.log(this.selectTaskSummaryList);
    },
    // 刷新任务结果数据
    async getSelectResultList() {
      // this.selectResultList = null;
      this.resuleStatusList = [];
      // 获取交互结果
      const { data: data3 } = await getSelectResult({ taskId: parseInt(localStorage.getItem('taskId')) });
      // const {data: data3} = await getSelectResult({taskId: 1}); // 测试
      this.selectResultList = data3;
      // console.log(this.selectResultList);
      if (this.selectResultList !== null) {
        this.selectResultList.forEach(item => {
          if (item.startTime !== null) {
            item.actualhours = this.timeInit(item.startTime, item.endTime);
          }
          this.resuleStatusList.push(item.status);
        });
      }
    },
    // 判断是否是管理员
    getIsStatus() {
      if (parseInt(sessionStorage.getItem('usertype')) === 1) {
        this.isAdmin = true;
      } else {
        this.isAdmin = false;
      }
    },
    // 判断当前登录人是否是任务或项目的创建人或负责人
    async getSelectTypeByUserId() {
      const { data } = await getSelectTypeByUserId({ taskId: parseInt(localStorage.getItem('taskId')), userId: parseInt(sessionStorage.getItem('userid')) });
      // console.log(data);
      if (data.projectCharge === true || data.projectCreate === true || data.taskCharge === true || data.taskCreate === true) {
        this.isCreates = true;
      } else {
        this.isCreates = false;
      }
      if (data.projectCharge === true || data.projectCreate === true) {
        this.isProjectCreates = true;
      } else {
        this.isProjectCreates = false;
      }
      // console.log(this.isCreates);
      // console.log(this.isProjectCreates);
    },
    // 点击盒子选中里面单选框
    clickInput(e) {
      e.currentTarget.lastElementChild.click();
    },
    inputClickEvent(e, item) {
      e.stopPropagation();
    },
    // 审核人id
    getCheckedId() {
      // this.selectTaskSummaryList.checkedidList.forEach(item => {
      //   this.arr.push(item.userId);
      // });
      if (this.selectTaskSummaryList.checkedidList.length > 0) {
        this.arr = this.selectTaskSummaryList.checkedidList.map((item, index) => {
          return Object.assign({}, { 'projectUserId': item.projectUserId, 'userId': item.userId });
        });
      } else {
        this.arr = [];
      }
      // console.log(this.arr);
    },
    // 抄送人id
    getCopyId() {
      // this.selectTaskSummaryList.copyidList.forEach(item => {
      //   this.arr1.push(item.userId);
      // });
      if (this.selectTaskSummaryList.copyidList.length > 0) {
        this.arr1 = this.selectTaskSummaryList.copyidList.map((item, index) => {
          return Object.assign({}, { 'projectUserId': item.projectUserId, 'userId': item.userId });
        });
      } else {
        this.arr1 = [];
      }
    },
    // 执行人id
    getPerformId() {
      // this.selectTaskSummaryList.performidList.forEach(item => {
      //   this.arr2.push(item.userId);
      // });
      if (this.selectTaskSummaryList.performidList.length > 0) {
        this.arr2 = this.selectTaskSummaryList.performidList.map((item, index) => {
          return Object.assign({}, { 'projectUserId': item.projectUserId, 'userId': item.userId });
        });
      } else {
        this.arr2 = [];
      }
    },
    // 标签
    getlabel() {
      // console.log(this.selectTaskSummaryList.labelName);
      if (this.selectTaskSummaryList.labelName.length !== 0) {
        this.labelList = this.selectTaskSummaryList.labelName;
        this.selectTaskSummaryList.labelName.forEach(item => {
          this.labelNameStr.push(item.labelName);
        });
      }
      // console.log(this.labelNameStr);
      // console.log(this.labelList);
    },
    // 点击编辑事件
    editmisBtn() {
      // this.getlabel();
      this.getCheckedId();
      this.getCopyId();
      this.getPerformId();
      // console.log(this.selectTaskSummaryList);
      this.showDialog = true;
    },
    // 任务开始按钮
    statusBtn(id) {
      if (this.selectTaskSummaryList.chargeList.length === 0) {
        return this.$message({
          showClose: true,
          message: '请添加任务负责人！',
          type: 'warning'
        });
      }
      if (this.selectTaskSummaryList.performidList.length === 0) {
        return this.$message({
          showClose: true,
          message: '请添加任务执行人！',
          type: 'warning'
        });
      }
      if (this.selectTaskSummaryList.checkedidList.length === 0) {
        return this.$message({
          showClose: true,
          message: '请添加任务审核人！',
          type: 'warning'
        });
      }
      this.$confirm('是否开始任务?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const res = await taskStart(id);
        // 刷新列表
        this.getSelectTaskSummary();
        if (res.code === 200) {
          return this.$message({
            showClose: true,
            message: '任务开始成功！',
            type: 'success'
          });
        } else {
          return this.$message({
            showClose: true,
            message: res.msg,
            type: 'error'
          });
        }
      });
    },
    // 重启任务按钮
    restartBtn(id) {
      this.$confirm('是否重启任务?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const res = await restartTask(id);
        // 刷新列表
        this.getSelectTaskSummary();
        if (res.code === 200) {
          return this.$message({
            showClose: true,
            message: '任务重启成功！',
            type: 'success'
          });
        } else {
          return this.$message({
            showClose: true,
            message: res.msg,
            type: 'error'
          });
        }
      });
    },
    // 任务结束按钮
    endTaskBtn(id) {
      this.$confirm('是否结束任务?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const res = await updateTaskStatus(id);
        if (res.code === 200) {
          // 刷新列表
          this.getSelectTaskSummary();
          await resultTesting({ taskId: this.selectTaskSummaryList.taskId });
          await resultBigTesting({ taskId: this.selectTaskSummaryList.taskId });
          return this.$message({
            showClose: true,
            message: '任务结束成功！',
            type: 'success'
          });
        } else {
          return this.$message({
            showClose: true,
            message: res.msg,
            type: 'error'
          });
        }
      });
    },
    // 删除任务
    delTaskBtn(id) {
      this.$confirm('是否删除任务?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const res = await deleteTask(id);
        // 跳转到列表
        this.$router.push('task');
        if (res.code === 200) {
          return this.$message({
            showClose: true,
            message: '删除任务成功！',
            type: 'success'
          });
        } else {
          return this.$message({
            showClose: true,
            message: '删除任务失败，请稍后重试！',
            type: 'error'
          });
        }
      });
    },

    // 执行人交互结果按钮事件
    // 开始任务按钮
    async startTaskBtn(i) {
      // console.log(i);
      this.stautsData.status = i.status;
      this.stautsData.taskresultId = i.id;
      this.stautsData.type = 1;
      // console.log(this.stautsData);
      this.$confirm('是否开始任务? 任务开始后，请根据任务介绍来完成任务，任务过程将会计时。', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const res = await updateStauts(this.stautsData);
        // 刷新列表
        // this.getSelectTaskSummary();
        if (res.code === 200) {
          this.reload();
          // setTimeout(() => {
          //   // this.$router.go(0);
          //   // window.location.reload();
          // }, 500);
          return this.$message({
            showClose: true,
            message: '任务开始成功！',
            type: 'success'
          });
        } else {
          return this.$message({
            showClose: true,
            message: '任务开始失败，请稍后重试！',
            type: 'error'
          });
        }
      });
    },
    // 提交结果按钮
    async submitResultsBtn(i) {
      // console.log(i);
      this.resultData.content = this.inputContent;
      this.resultData.id = i.id;
      this.resultData.type = 1;
      if (this.resultData.content === '') {
        return this.$message({
          showClose: true,
          message: '请填写交付内容！',
          type: 'warning'
        });
      }
      // console.log(this.resultData);
      const res = await updateResult(this.resultData);
      // console.log(res);
      if (res.code === 200) {
        this.stautsData.status = i.status;
        this.stautsData.taskresultId = i.id;
        this.stautsData.type = 1;
        // console.log(this.stautsData);
        await updateStauts(this.stautsData);
        this.getSelectResultList();
        // 刷新
        // this.questionnaireDiaBtn();
        this.submitTestingData.taskResultId = i.id;
        this.stautsData.status = i.status + 2;
        this.stautsData.taskresultId = i.id;
        this.stautsData.type = 1;
        // if (this.editList === null) {
        //   return this.$message.warning('请完善执行人问卷！');
        // }
        if (this.selectTaskSummaryList.reviewer === true) {
          this.questionnaireDia = true;
        }
        return this.$message({
          showClose: true,
          message: '提交结果成功',
          type: 'success'
        });
      } else {
        return this.$message({
          showClose: true,
          message: '提交结果失败，请稍后重试',
          type: 'error'
        });
      }
    },
    // 执行人填写问卷按钮
    questionnaireDiaBtn(i) {
      // console.log(i);
      this.submitTestingData.taskResultId = i.id;
      this.stautsData.status = i.status + 1;
      this.stautsData.taskresultId = i.id;
      this.stautsData.type = 1;
      if (this.editList === null) {
        return this.$message({
          showClose: true,
          message: '请完善执行人问卷！',
          type: 'warning'
        });
      }
      this.questionnaireDia = true;
    },
    // 执行人问卷选项单选答案添加
    getboxValue1(e, item, o) {
      // console.log(item);
      // console.log(o);
      const arr = [];
      for (let j = 0; j < o.answervolist.length; j++) {
        arr.push(o.answervolist[j].itemId);
      }
      arr.forEach(item => {
        for (let i = 0; i < this.submitTestingData.testingQuestionItemId.length; i++) {
          if (this.submitTestingData.testingQuestionItemId[i] === item) {
            this.submitTestingData.testingQuestionItemId.splice(i, 1);
            break;
          }
        }
      });
      if (e.target.checked) {
        this.submitTestingData.testingQuestionItemId.push(item.itemId);
      }

      // console.log(this.submitTestingData.testingQuestionItemId);
    },
    change1Btn(i) {
      // console.log(this.submitTestingData.testingQuestionItemId);
      // console.log(i);
    },
    // 执行人问卷选项多选答案添加
    getboxValue2(e, item, o) {
      // console.log(o);
      const arr = [];
      for (let j = 0; j < o.answervolist.length; j++) {
        arr.push(o.answervolist[j].itemId);
      }
      let arr1 = [];
      arr.forEach(item => {
        this.submitTestingData.testingQuestionItemId.forEach(ele => {
          if (item === ele) {
            arr1.push(ele);
          }
        });
      });
      if (!e.target.checked) {
        for (let i = 0; i < this.submitTestingData.testingQuestionItemId.length; i++) {
          if (this.submitTestingData.testingQuestionItemId[i] === item.itemId) {
            this.submitTestingData.testingQuestionItemId.splice(i, 1);
            arr1.splice(i, 1);
            item.checked = false;
            break;
          }
        }
      }
      // console.log(arr);
      // console.log(arr1);
      if (arr1.length > o.maxcount - 1) {
        item.checked = false;
        // 强制刷新
        this.$forceUpdate();
        // console.log(item);
        return this.$message({
          showClose: true,
          message: '最多只能选' + o.maxcount + '项',
          type: 'warning'
        });
      }
      if (e.target.checked) {
        item.checked = true;
        this.submitTestingData.testingQuestionItemId.push(item.itemId);
      } else {
        for (let i = 0; i < this.submitTestingData.testingQuestionItemId.length; i++) {
          if (this.submitTestingData.testingQuestionItemId[i] === item.itemId) {
            this.submitTestingData.testingQuestionItemId.splice(i, 1);
            break;
          }
        }
      }
      // console.log(this.submitTestingData.testingQuestionItemId);
    },
    // 执行人问卷提交按钮
    async reviewOk() {
      this.submitTestingData.taskId = this.selectTaskSummaryList.taskId;
      // console.log(this.submitTestingData);
      const res = await submitTesting(this.submitTestingData);
      // console.log(res);
      if (res.code === 200) {
        // 刷新
        await updateStauts(this.stautsData);
        // this.getSelectResultList();
        // 刷新
        this.reload();
        // setTimeout(() => {
        //   // this.$router.go(0);
        //   // window.location.reload();
        // }, 500);
        this.questionnaireDia = false;
        return this.$message({
          showClose: true,
          message: '填写问卷成功',
          type: 'success'
        });
      } else {
        return this.$message({
          showClose: true,
          message: '填写问卷失败，请稍后重试',
          type: 'error'
        });
      }
    },
    // 提交审核按钮
    async submitReviewBtn(i) {
      this.stautsData.status = i.status;
      this.stautsData.taskresultId = i.id;
      this.stautsData.type = 1;
      const res = await updateStauts(this.stautsData);
      // console.log(res);
      if (res.code === 200) {
        // 刷新
        // this.getSelectResultList();
        // 刷新
        this.reload();
        // setTimeout(() => {
        //   // this.$router.go(0);
        //   // window.location.reload();
        // }, 100);
        return this.$message({
          showClose: true,
          message: '提交审核成功',
          type: 'success'
        });
      } else {
        return this.$message({
          showClose: true,
          message: '提交审核失败，请稍后重试',
          type: 'error'
        });
      }
    },
    // 审核按钮
    async shenHeShowBtn(i) {
      // console.log(i);
      this.approveIsData.taskResultId = parseInt(i.id);
      this.approveIsData.taskId = parseInt(i.taskid);
      // console.log(this.approveIsData);
      const res = await getSelectLastApproveIs(this.approveIsData);
      // const res = await getSelectLastApproveIs({taskId: i.taskid, taskResultId: i.id});
      // console.log(res);
      if (res.data === true) {
        this.addtrcData.reason = '';
        this.addtrcData.taskresultid = i.id;
        this.reviewerStatusData.taskId = i.taskid;
        this.reviewerStatusData.taskResultId = i.id;
        this.stautsData.status = i.status;
        this.stautsData.taskresultId = i.id;
        this.stautsData.type = 2;
        // 获取审核人审核原因
        const { data: data1 } = await getSelectLastExamine({ taskId: i.taskid, taskResultId: i.id });
        // console.log(data1);
        if (data1 !== null) {
          this.addtrcData.reason = data1.reason;
        }
        this.shenHeShow = true;
      } else {
        return this.$message({
          showClose: true,
          message: '请稍候，当前还未到您审核！',
          type: 'warning'
        });
      }
    },
    // 审核通过
    async confirmup() {
      this.addtrcData.status = 2;
      // console.log(this.addtrcData);
      // 提交审核
      const res1 = await addtrc(this.addtrcData);
      // console.log(res);
      if (res1.code === 200) {
        // 修改状态
        // await updateStauts(this.stautsData);
        // 查询审核人是否全部审核完，并修改状态
        await getSelectReviewerStatus(this.reviewerStatusData);
        // 刷新
        this.getSelectTaskSummary();
        // console.log(res1);
        this.shenHeShow = false;
        return this.$message({
          showClose: true,
          message: '审核完成！',
          type: 'success'
        });
      } else {
        return this.$message({
          showClose: true,
          message: '审核失败，请稍后重试！',
          type: 'error'
        });
      }
    },
    // 审核不通过
    async reviewReturn() {
      this.addtrcData.status = 3;
      // console.log(this.addtrcData);
      const res = await addtrc(this.addtrcData);
      // console.log(res);
      if (res.code === 200) {
        // 刷新
        // await updateStauts(this.stautsData);
        // const res1 = await getSelectReviewerStatus(this.reviewerStatusData);
        // console.log(res1);
        this.getSelectTaskSummary();
        this.shenHeShow = false;
        return this.$message({
          showClose: true,
          message: '审核完成！',
          type: 'success'
        });
      } else {
        return this.$message({
          showClose: true,
          message: '审核失败，请稍后重试！',
          type: 'error'
        });
      }
    },
    // 审核人填写问卷按钮
    async questionnaireDiaBtn1(i) {
      // console.log(i);
      // 获取审核人问卷
      const { data: data5 } = await getSelectTesting({ taskId: parseInt(localStorage.getItem('taskId')), testType: 2 });
      // const {data: data2} = await getSelectTesting({taskId: 22, testType: 1}); // 测试
      this.editList1 = data5;
      // 获取审核人审核原因
      const { data: data1 } = await getSelectLastExamine({ taskId: i.taskid, taskResultId: i.id });
      // console.log(data1);
      if (data1 !== null) {
        this.addtrcData.reason = data1.reason;
      }
      // 获取审核人问卷答案
      const { data } = await getSelectNowAnswerByTaskId({ taskResultId: i.id });
      this.nowAnswer = data;
      this.submitTestingData.testingQuestionItemId = data;
      // console.log(data);
      this.editList1.questionList.forEach(item => {
        item.answervolist.forEach(i => {
          if (data.indexOf(i.itemId) !== -1) {
            i.checked = true;
          } else {
            i.checked = false;
          }
        });
      });
      // console.log(this.editList1);
      this.approveIsData.taskResultId = parseInt(i.id);
      this.approveIsData.taskId = parseInt(i.taskid);
      // console.log(this.approveIsData);
      const res = await getSelectLastApproveIs(this.approveIsData);
      // console.log(res);
      if (res.data === true) {
        // this.addtrcData.reason = '';
        this.addtrcData.taskresultid = i.id;
        this.reviewerStatusData.taskId = i.taskid;
        this.reviewerStatusData.taskResultId = i.id;
        this.stautsData.status = 5;
        this.stautsData.taskresultId = i.id;
        this.stautsData.type = 2;
        this.submitTestingData.taskResultId = i.id;
        this.reviewerStatusData.taskId = i.taskid;
        this.reviewerStatusData.taskResultId = i.id;
        // this.submitTestingData.testingQuestionItemId = [];
        if (this.editList1 === null) {
          return this.$message({
            showClose: true,
            message: '请完善审核人问卷！',
            type: 'warning'
          });
        }
        this.questionnaireDia1 = true;
      } else {
        return this.$message({
          showClose: true,
          message: '请稍候，当前还未到您审核！',
          type: 'warning'
        });
      }
    },
    // 审核人问卷选项单选答案添加
    getboxValue3(e, item, o) {
      // console.log(this.submitTestingData.testingQuestionItemId);
      const arr = [];
      for (let j = 0; j < o.answervolist.length; j++) {
        arr.push(o.answervolist[j].itemId);
      }
      arr.forEach(item => {
        for (let i = 0; i < this.submitTestingData.testingQuestionItemId.length; i++) {
          if (this.submitTestingData.testingQuestionItemId[i] === item) {
            this.submitTestingData.testingQuestionItemId.splice(i, 1);
            break;
          }
        }
      });
      if (e.target.checked) {
        // item.checked = true;
        this.submitTestingData.testingQuestionItemId.push(item.itemId);
        o.answervolist.forEach(k => {
          if (k.itemId !== item.itemId) {
            k.checked = false;
          } else {
            k.checked = true;
          }
        });
      } else {
        for (let i = 0; i < this.submitTestingData.testingQuestionItemId.length; i++) {
          if (this.submitTestingData.testingQuestionItemId[i] === item.itemId) {
            this.submitTestingData.testingQuestionItemId.splice(i, 1);
            break;
          }
        }
      }
      // console.log(this.submitTestingData.testingQuestionItemId);
      // console.log(item, o);
    },
    // 审核人问卷选项多选答案添加
    getboxValue4(e, item, o) {
      // console.log(o);
      let arr = [];
      for (let j = 0; j < o.answervolist.length; j++) {
        arr.push(o.answervolist[j].itemId);
      }
      let arr1 = [];
      arr.forEach(item => {
        this.submitTestingData.testingQuestionItemId.forEach(ele => {
          if (item === ele) {
            arr1.push(ele);
          }
        });
      });
      if (!e.target.checked) {
        for (let i = 0; i < this.submitTestingData.testingQuestionItemId.length; i++) {
          if (this.submitTestingData.testingQuestionItemId[i] === item.itemId) {
            this.submitTestingData.testingQuestionItemId.splice(i, 1);
            arr1.splice(i, 1);
            item.checked = false;
            break;
          }
        }
      }
      // console.log(arr);
      // console.log(arr1);
      if (arr1.length > o.maxcount - 1) {
        item.checked = false;
        // console.log(item);
        return this.$message({
          showClose: true,
          message: '最多只能选' + o.maxcount + '项',
          type: 'warning'
        });
      }
      if (e.target.checked) {
        item.checked = true;
        this.submitTestingData.testingQuestionItemId.push(item.itemId);
      } else {
        for (let i = 0; i < this.submitTestingData.testingQuestionItemId.length; i++) {
          if (this.submitTestingData.testingQuestionItemId[i] === item.itemId) {
            this.submitTestingData.testingQuestionItemId.splice(i, 1);
            break;
          }
        }
      }
      // console.log(this.submitTestingData.testingQuestionItemId);
    },
    // 审核人问卷取消按钮
    async reviewDel() {
      this.addtrcData.status = 3;
      // console.log(this.addtrcData);
      const res = await addtrc(this.addtrcData);
      if (res.code === 200) {
        // 刷新
        this.getSelectTaskSummary();
        this.questionnaireDia1 = false;
        return this.$message({
          showClose: true,
          message: '审核完成！',
          type: 'success'
        });
      } else {
        return this.$message({
          showClose: true,
          message: '审核失败，请稍后重试！',
          type: 'error'
        });
      }
    },
    // 审核人问卷提交按钮
    async reviewOk1() {
      this.submitTestingData.taskId = this.selectTaskSummaryList.taskId;
      // console.log(this.submitTestingData);
      if (this.submitTestingData.testingQuestionItemId.length === 0) {
        return this.$message({
          showClose: true,
          message: '请填写问卷！',
          type: 'warning'
        });
      }
      const res = await submitReviewersTesting(this.submitTestingData);
      // console.log(res);
      if (res.code === 200) {
        this.addtrcData.status = 2;
        // 刷新
        await addtrc(this.addtrcData);
        // await updateStauts(this.stautsData);
        await getSelectReviewerStatus(this.reviewerStatusData);
        // await resultTesting({taskId: this.selectTaskSummaryList.taskId});
        // await resultBigTesting({taskId: this.selectTaskSummaryList.taskId});
        // const res1 = await getSelectReviewerStatus(this.reviewerStatusData);
        // console.log(res1);
        this.getSelectTaskSummary();
        // console.log(res1);
        this.questionnaireDia1 = false;
        return this.$message({
          showClose: true,
          message: '审核成功！',
          type: 'success'
        });
      } else {
        return this.$message({
          showClose: true,
          message: '审核失败，请稍后重试！',
          type: 'error'
        });
      }
    },

    // 任务计时器------------------------------------
    // 初始化计时器
    timeInit(timer, timer1) {
      // console.log(Date.now());
      let startTime = this.getUnixTime(timer);
      // console.log(startTime * 1000);
      if (timer1 === null) {
        this.nowTime = Date.now() - (startTime * 1000);
      } else {
        let endTime = this.getUnixTime(timer1);
        this.nowTime = (endTime * 1000) - (startTime * 1000);
      }
      // console.log(this.nowTime);
      let s = this.toHHmmss(this.nowTime);
      let d = s.split(':');
      this.one = d[0];
      this.two = d[1];
      this.three = d[2];
      this.abc = parseInt(d[2]);
      this.cde = parseInt(d[1]);
      this.efg = parseInt(d[0]);
      // this.startHandler();
      let time = this.one + ':' + this.two + ':' + this.three;
      // console.log(time);
      return time;
    },
    // 时间转换
    getUnixTime(dateStr) {
      const newstr = dateStr.replace(/-/g, '/');
      const date = new Date(newstr);
      let timeStr = date.getTime().toString();
      return timeStr.substr(0, 10);
    },
    // 时间戳转换成时分秒
    toHHmmss(date) {
      let time;
      let hours = parseInt((date % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
      let minutes = parseInt((date % (1000 * 60 * 60)) / (1000 * 60));
      let seconds = parseInt((date % (1000 * 60)) / 1000);
      time = (hours < 10 ? ('0' + hours) : hours) + ':' + (minutes < 10 ? ('0' + minutes) : minutes) + ':' + (seconds < 10 ? ('0' + seconds) : seconds);
      return time;
    },

    // 附件上传 ---------------------------------------------

    uploadBtn(i) {
      // console.log(i);
      this.businessId = i.id;
    },
    handleExceed(files, fileList) {
      this.$message({
        showClose: true,
        message: `当前限制选择 10 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`,
        type: 'warning'
      });
    },
    // 删除文件
    removeFile(o) {
      // console.log(o);
      // console.log(this.fileList);
      this.$confirm('确定要删除该数据吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        const res = await deleteFile({ fileId: parseInt(o.fileId) });
        if (res.code === 200) {
          this.$message({
            showClose: true,
            message: res.msg,
            type: 'success'
          });
          this.getSelectResultList();
        } else {
          this.$message({
            showClose: true,
            message: res.msg,
            type: 'error'
          });
        }
      }).catch((err) => {
        console.log(err);
      });
    },
    // 上传文件之前
    handleChange(file) {
      // console.log(file);
      // console.log('111');
      // console.log(this.fileList);
      let size10M = file.size / 1024 / 1024 < 50;
      if (!size10M) {
        this.$message.warning('上传文件大小不能超过 50MB!');
        return false;
      }
      let flag = true;
      this.fileList.forEach(item => {
        if (item.size === file.size) {
          flag = false;
          return this.$message({
            showClose: true,
            message: '请不要重复上传附件！',
            type: 'warning'
          });
        }
      });
      if (!flag) {
        if (!flag) return Promise.reject(flag); // 正确的终止
      }
    },
    // 上传时
    onUpload(event, file, fileList) { // 三个参数看情况使用
      this.showPercent = true;
      this.progressPercent = this.progressPercent === 100 ? 99 : Math.floor(event.percent);
    },
    // 上传成功
    handleSuccess(res, value, fileList) {
      // console.log('12312313', res, value);
      // console.log(fileList);
      // console.log(res);
      this.progressPercent = 100;
      this.fileList = fileList;
      if (res.code === 200) {
        this.$message({
          showClose: true,
          type: 'success',
          message: res.msg
        });
        this.getSelectResultList();
        this.showPercent = false;
        this.progressPercent = 0;
      } else {
        return this.$message({
          showClose: true,
          type: 'error',
          message: res.msg
        });
      }
    },

    // 日志、评论切换
    handelchange(index) {
      this.isactive = index;
      if (index === 0) {
        this.footerview = 'projectinfo';
      } else {
        this.footerview = 'dosth';
      }
    }
  }
};
</script>

<style lang="less" scoped>
/deep/ .el-checkbox {
  position: relative;
  width: 100%;
  height: 35px;
  line-height: 35px;
  margin: 0;
  border-bottom: 1px solid #e6ebff;
  .el-checkbox__input {
    position: absolute;
    right: 24px;
    margin-top: 7px;
    .el-checkbox__inner {
      width: 20px;
      height: 20px;
      line-height: 20px;
      text-align: center;
    }
  }
}
/deep/ .el-dialog__body {
  padding: 0;
}
/deep/ .el-table__cell {
  padding: 0;
  height: 55px;
  border-left: 1px solid #e6ebff;
}
/deep/ .el-input__inner {
  width: 100%;
  height: 45px;
  border: none;
  // border-bottom: 1px solid #e6ebff;
  // border-right: none;
}
/deep/ .cell {
  padding: 0;
  border: none;
}
.el-table {
  /deep/tbody tr:hover > td {
    background-color: #fff;
  }
}
.firstinfoBox {
  overflow: hidden;
}
.firstinfo {
  margin-top: -1px;
  width: 98%;
  height: 98%;
  box-shadow: 0px 1px 3px 0px rgba(153, 153, 153, 0.5),
    1px -1px 3px 0px rgba(153, 153, 153, 0.5);
  background: white;
  text-align: center;
  color: #333;
  padding: 20px;
  margin-bottom: 20px;
  .tit {
    font-size: 16px;
    font-weight: 400;
    color: #222;
  }
  .misLV {
    height: 24px;
    width: 80px;
    font-size: 12px;
    font-family: SukhumvitSet-Bold;
    background-color: #e8f8ec;
    text-align: center;
    line-height: 24px;
    display: inline-block;
    border-radius: 12px;
    margin-left: 15px;
    color: #fff;
  }
  .LvOne {
    background: #c5f5d1;
  }
  .LvTwo {
    background: #f7cbd2;
  }
  .LvThree {
    background: #cbd5f5;
  }
  .tags {
    height: 19px;
    margin: 10px 0 20px 0;
    .el-tag + .el-tag {
      margin-left: 10px;
    }
  }
  .btns {
    height: 40px;
    position: absolute;
    right: 20px;
    top: 90px;
    button {
      width: 115px;
      height: 40px;
      line-height: 40px;
      margin-right: 15px;
      font-size: 16px;
      text-align: center;
      color: #2fc0e0;
      border-radius: 5px;
      cursor: pointer;
    }
    .endmis {
      background: #e8f8fb;
    }
    .delmis {
      background: #e8f8fb;
    }
    .editmis {
      background: #2fc0e0;
      color: white;
    }
  }
  .infotable {
    margin-bottom: 20px;
    table {
      width: 100%;
      border-left: 1px solid #f1f4ff;
      border-top: 1px solid #f1f4ff;
      tr {
        td {
          transition: all 0.3s;
          padding-left: 20px;
          height: 60px;
          text-align: left;
          border-right: 1px solid #f1f4ff;
          border-bottom: 1px solid #f1f4ff;
          #nameInput,
          #estimateTimeInput,
          #miscodeInput {
            border: none;
            outline: none;
            width: 80%;
            height: 80%;
          }
          .examineTd {
            .examineTdLeft {
              float: left;
            }
          }
          .missioner {
            display: flex;
            align-items: center;
            .editBox {
              display: flex;
              align-items: center;
              justify-content: center;
              width: 100px;
              height: 40px;
              color: #555;
              line-height: 40px;
              background: #e8f8fb;
            }
            .editspan {
              margin: 5px;
              width: 100px;
              height: 40px;
              background: #e8f8fb;
              border-radius: 4px;
              color: #555;
              line-height: 40px;
              text-align: center;
            }
            .missionerinfo {
              display: inline-block;
              text-align: center;
              p {
                margin: 0;
                max-width: 80px;
                color: #555;
              }
              img {
                width: 45px;
                height: 45px;
                border-radius: 50%;
                box-shadow: 1px 1px 3px #d7d7d7;
              }
            }
            .moremissioner {
              width: 55px;
              height: 55px;
              border-radius: 50%;
              background: #e8f8fb;
              box-shadow: 1px 1px 2px 0px rgba(215, 215, 215, 0.5);
              border: 3px solid #ffffff;
              color: #2fc0e0;
              text-align: center;
              line-height: 55px;
            }
            img {
              width: 50px;
              height: 50px;
              margin: 0 10px;
              border-radius: 50%;
            }
          }
          .domany {
            border: 1px solid #6c59cc;
            width: 150px;
            height: 20px;
            border: 0;
            margin: 0 10px;
            .many {
              display: inline-block;
              background-image: linear-gradient(
                270deg,
                #1160cf 0%,
                #cd06bf 100%
              );
              border-radius: 10px;
              text-align: center;
              color: white;
              // line-height: 20px;
            }
          }
        }
        td {
          box-sizing: border-box;
          font-size: 12px;
        }
        // td:hover {
        //   box-shadow: inset 0px 1px 4px 0px #2fc0e0,
        //     inset 0px -1px 4px 0px #2fc0e0, inset 1px 0px 4px 0px #2fc0e0,
        //     inset -1px 0px 4px 0px #2fc0e0;
        // }
      }
    }
  }
  .giventable {
    text-align: left;
    .distit {
      font-size: 14px;
      font-weight: 700;
      color: #222;
      margin-top: 30px;
    }
    .el-table {
      /deep/tbody tr:hover > td {
        background-color: #fff;
      }
      .cell {
        margin: 0;
        position: relative;
        p {
          margin: 0;
        }
        .uperinfo {
          width: 45px;
          height: 45px;
          border-radius: 50%;
          box-shadow: 1px 1px 3px #888888;
        }
        .upercontent {
          display: -webkit-box;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 3;
          overflow: hidden;
          #nameInput {
            border: none;
            outline: none;
            text-align: center;
            width: 60%;
            height: 60%;
          }
          .empty {
            color: rgb(204, 204, 204);
            font-size: 14px;
            text-align: left;
          }
        }
        .nofile {
          .upfiles {
            // display: flex;
            .lessfile {
              position: absolute;
              bottom: 10px;
              right: 10px;
              width: 40px;
              height: 40px;
              line-height: 40px;
              text-align: center;
              border-radius: 20px;
              background-color: #e8f8fb;
              .plus {
                cursor: pointer;
                line-height: 40px;
                font-size: 40px;
                color: #2fc0e0;
                padding: 0;
              }
            }
            .upfile {
              width: 100%;
              height: 40px;
              padding: 0 15px;
              line-height: 40px;
              margin-right: 40px;
              // border: 1px solid rgba(153, 153, 153, 0.1);
              // box-shadow: 1px 1px 3px #d7d7d7;
              // border-radius: 5px;
              .upfileinfo {
                display: flex;
                width: 100%;
                height: 100%;
                img {
                  width: 30px;
                  height: 30px;
                  margin-right: 10px;
                }
                a {
                  width: 180px;
                  text-align: left;
                  overflow: hidden;
                  color: #000;
                }
                a:hover {
                  color: #2fc0e0;
                }
                .filedo {
                  display: none;
                  margin-left: 20px;
                  a {
                    margin-right: 20px;
                    color: #2fc0e0;
                  }
                }
              }
              .upfileinfo:hover .filedo {
                display: block;
              }
            }
          }
        }
      }
      /deep/ td:focus-within {
        box-shadow: inset 0px 1px 4px 0px #2fc0e0,
          inset 0px -1px 4px 0px #2fc0e0, inset 1px 0px 4px 0px #2fc0e0,
          inset -1px 0px 4px 0px #2fc0e0;
      }
    }
  }
  // /deep/ .cell {
  //   width: 100%;
  //   height: 100%
  // }
  .ingstatus {
    color: #ffd167;
  }
  .ingstatus::before {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 3px;
    background: #ffd167;
    box-shadow: 0 0 3px #ffd167;
  }
  .nonestatus {
    color: #555;
  }
  .nonestatus::before {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #555;
    margin-right: 3px;
    box-shadow: 0 0 3px #555;
  }
  .completestatus {
    color: #3ea528;
  }
  .completestatus::before {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #3ea528;
    margin-right: 3px;
    box-shadow: 0 0 3px #3ea528;
  }
  .footertab {
    text-align: left;
    margin-top: 40px;
    width: 100%;
    a {
      color: rgb(94, 94, 94);
      font-size: 14px;
      margin-right: 20px;
    }
    .active {
      color: #333;
      font-size: 18px;
      font-weight: bolder;
      position: relative;
      border-bottom: 7px solid transparent;
      border-image: linear-gradient(90deg, #1160cf 0%, #cd06bf 100%);
      border-image-slice: 1;
      // .litline {
      //   position: absolute;
      //   bottom: -10px;
      //   left: 25%;
      //   display: inline-block;
      //   width: 35px;
      //   height: 8px;
      //   border-radius: 4px;
      //   background: linear-gradient(90deg, #1160cf 0%, #cd06bf 100%);
      // }
    }
  }
  .DiaTable {
    .DiaTopBox {
      position: relative;
      height: 55px;
      text-align: center;
      line-height: 55px;
      font-size: 16px;
      color: #333;
      background-color: #f1f5ff;
      .closeBtn {
        position: absolute;
        right: 10px;
        top: calc(50% - 6px);
      }
    }
    .DiaTopBox1 {
      border-bottom: 1px solid #ddd;
    }
    .missionerinfoBox {
      height: 100px;
      display: flex;
      padding: 10px 25px;
      div {
        margin-right: 15px;
      }
      .missBox {
        height: 100px;
        line-height: 100px;
      }
      .missionerinfo {
        display: inline-block;
        text-align: center;
        p {
          margin: 0;
          max-width: 80px;
          color: #555;
        }
        img {
          width: 45px;
          height: 45px;
          border-radius: 50%;
          box-shadow: 1px 1px 3px #d7d7d7;
        }
      }
    }
  }
  .DioBox {
    .DiaTopBox {
      position: relative;
      height: 55px;
      text-align: center;
      line-height: 55px;
      font-size: 16px;
      color: #333;
      background-color: #f1f5ff;
      .closeBtn {
        position: absolute;
        right: 10px;
        top: calc(50% - 6px);
      }
    }
    .DiaTopBox1 {
      border-bottom: 1px solid #ddd;
    }
    .missionerinfoBox {
      height: 100px;
      display: flex;
      padding: 10px 25px;
      div {
        margin-right: 15px;
      }
      .missBox {
        height: 100px;
        line-height: 100px;
      }
      .missionerinfo {
        display: inline-block;
        text-align: center;
        p {
          margin: 0;
          max-width: 80px;
          color: #555;
        }
        img {
          width: 45px;
          height: 45px;
          border-radius: 50%;
          box-shadow: 1px 1px 3px #d7d7d7;
        }
      }
    }
    .DiaBodyBox {
      width: 90%;
      // height: 166px;
      font-size: 14px;
      color: #333;
      margin: 0 auto;
      border: none;
      p {
        text-align: left;
      }
      .disbox {
        width: 100%;
        height: 86px;
        padding: 10px;
        font-size: 14px;
        color: #555;
        font-weight: 400;
        text-align: center;
        border: 1px solid #f1f4ff;
        // border: none;
        box-sizing: border-box;
        outline: none;
      }
      .disbox1 {
        height: 126px;
      }
      textarea::-webkit-input-placeholder {
        /* WebKit browsers */
        /* placeholder颜色  */
        color: #ccc;
      }
      textarea:-moz-placeholder {
        /* Mozilla Firefox 4 to 18 */
        color: #ccc;
      }
      textarea::-moz-placeholder {
        /* Mozilla Firefox 19+ */
        color: #ccc;
      }
      textarea::-ms-input-placeholder {
        /* Internet Explorer 10+ */
        color: #ccc;
      }
      .disbox:focus-within {
        box-shadow: inset 0px 1px 4px 0px #2fc0e0,
          inset 0px -1px 4px 0px #2fc0e0, inset 1px 0px 4px 0px #2fc0e0,
          inset -1px 0px 4px 0px #2fc0e0;
      }
    }
    .DiaBodyBox1 {
      width: 96%;
    }
    .btnbox {
      box-sizing: border-box;
      border: none;
      height: 76px;
      .cancle {
        cursor: pointer;
        width: 100px;
        height: 35px;
        background-color: #e8f8fb;
        color: #2fc0e0;
        font-size: 16px;
        border-radius: 5px;
        margin: 20px 60px 0 0;
        box-shadow: 0 0 5px #e8f8fb;
      }
      .edit {
        cursor: pointer;
        width: 100px;
        height: 35px;
        background-color: #2fc0e0;
        color: #fff;
        font-size: 16px;
        border-radius: 5px;
        margin-top: 20px;
        box-shadow: 0 0 5px #2fc0e0;
        margin-top: 20px;
      }
    }
  }
  /deep/.el-dialog__wrapper {
    .el-dialog__header {
      height: 0;
      padding: 0;
    }
    .optionBox {
      position: relative;
      height: 35px;
      line-height: 35px;
      margin: 0 !important;
      border-top: 1px solid #e6ebff;
      .checkBox {
        position: absolute;
        right: 20px;
        width: 20px;
        height: 20px;
        margin-top: 7px;
        .el-checkbox__input {
          width: 100%;
          height: 100%;
        }
        .el-checkbox__inner {
          width: 100%;
          height: 100%;
        }
      }
      .checkBox1 {
        right: 24px;
      }
      /deep/ .el-checkbox__input {
        width: 25px;
        height: 25px;
      }
    }
    .btnbox {
      box-sizing: border-box;
      height: 76px;
      border-top: 1px solid #e6ebff;
      .cancle {
        cursor: pointer;
        width: 100px;
        height: 35px;
        background-color: #e8f8fb;
        color: #2fc0e0;
        font-size: 16px;
        border-radius: 5px;
        margin: 20px 60px 0 0;
        box-shadow: 0 0 5px #e8f8fb;
      }
      .edit {
        cursor: pointer;
        width: 100px;
        height: 35px;
        background-color: #2fc0e0;
        color: #fff;
        font-size: 16px;
        border-radius: 5px;
        margin-top: 20px;
        box-shadow: 0 0 5px #2fc0e0;
        margin-top: 20px;
      }
    }
  }
  /deep/ .progressBox1 .el-progress-bar__outer {
    background-color: #ebeef5;
    height: 20px !important;
  }
  /deep/ .progressBox2 .el-progress-bar__outer {
    background-color: #e8f8fb;
    height: 20px !important;
  }
  /deep/ .el-progress-bar__innerText {
    font-size: 12px;
    font-family: DIN Alternate Bold;
  }
  /deep/ .el-progress.is-exception .el-progress-bar__inner {
    background-image: linear-gradient(90deg, #2fc0e0);
    text-align: center;
  }
  /deep/ .cell {
    font-weight: 400;
  }
  /deep/ .is-leaf {
    background-color: #f1f5ff;
  }
  .el-table {
    /deep/tbody tr:hover > td {
      background-color: #fff;
    }
  }
}
</style>
